﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>批量上传</title>
    <link href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    <link href="//cdn.bootcss.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet">
    <link href="/Areas/PawRoot/assets/css/common.css" rel="stylesheet" />
    <link href="/Areas/PawRoot/open/lotUploader/lotuploader1.0.1.min.css" rel="stylesheet" />
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
    <header class="panel panel-default">
        <div class="panel-heading">笔记默认展图</div>
        <article class="panel-body">
            <div class="row">
                <div class="form-horizontal">
                    <!--展图标题-->
                    <div class="form-group">
                        <label class="col-sm-2 control-label">展图标题：</label>
                        <div class="col-sm-5">
                            <input type="text" class="form-control" id="title" placeholder="不填代表默认标题...">
                        </div>
                        <label class="lot-blue">最大长度: 50 字符</label>
                    </div>
                    <!--展览小图-->
                    <div class="form-group">
                        <label class="col-sm-2 control-label" style="padding-top:13px;">展览小图：</label>
                        <div class="col-sm-5">
                            <span id="lot-uploader"></span>
                        </div>
                        <label class="lot-blue">单张图片: 2M以内（每次批量上传最多100张）</label>
                    </div>
                    <!--表单提交-->
                    <div class="form-group">
                        <label class="col-sm-2"></label>
                        <div class="col-sm-5">
                            <button id="form-success" class="btn btn-danger lot-form-btn">批 量 提 交</button>
                            <button id="form-gohome" class="btn btn-danger lot-form-btn">返 回 列 表</button>
                        </div>
                    </div>
                </div>
            </div>
        </article>
    </header>
    <script src="//cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
    <script src="/Areas/PawRoot/assets/js/common.min.js"></script>
    <script src="//cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <script src="/Areas/PawRoot/open/lotUploader/lotuploader1.0.2.min.js"></script>
    <script type="text/javascript">
        //实例化上传控件
        $.lotuploader({
            lotDocId: 'lot-uploader',
            lotUrl: '@Url.Action("Upload", "PartialView")',
            btnStr: '批量上传默认展图',
            fileSize: 1024 * 1024 * 2,
            fileCount: 100
        });
        //todo:消息提醒（不知道为啥，去掉则添加页面和编辑页面就没有弹窗口了）
        function showMsg(obj, time) {
            if (obj) {
                if (!time) { time = 1000; }
                easyDialog.open({ container: { content: obj }, autoClose: time });
            }
        }
        //返回Index
        $('#form-gohome').click(function () {
            window.location.href = '@Url.Action("Index")';
        });
        //提交表单
        $('#form-success').click(function () {
            //标题
            var title = $.trim($('#title').val());
            if (title.length < 1) {
                title = "笔记默认展图";
            }
            $.post('/PawRoot/DisPhoto/AddList', { title: title, imgs: $.lotuploader.getFiles() }, function (data) {
                if (data.Status) {
                    showMsg(data.Msg, 500);
                    setTimeout(function () {
                        window.location.href = '@Url.Action("Index")';
                    }, 1000)
                } else {
                    showMsg(data.Msg);
                }
            });
        });
    </script>
</body>
</html>